<div class="kanban-container" ng-controller="KanbanCtrl" ui-tab-gate ui-attach-scroll="> .kanban-view">
  <div class="navbar record-toolbar">
    <div class="navbar-inner">
      <div class="container" ui-toolbar-adjust>
        <div class="btn-group">
          <button class="btn" ng-click="onNew()" ng-if="hasButton('new')" title="{{:: _t('New') }}">
            <i class="fa fa-plus"></i> <span ng-if="::!tbTitleHide" x-translate>New</span>
          </button>
          <button class="btn" ng-click="onRefresh()" ng-if="hasButton('refresh')" title="{{:: _t('Refresh') }}">
            <i class="fa fa-refresh"></i> <span ng-if="::!tbTitleHide" x-translate>Refresh</span>
          </button>
        </div>
        <div class="btn-group view-toolbar" ng-if="toolbar">
          <button ng-repeat="btn in toolbar | filter:{custom: true}" class="btn" ui-tool-button="btn">{{btn.title}}</button>
        </div>
        <div ui-menu-bar x-menus="toolbarAsMenu" x-handler="this" class="view-toolbar-mobile" style="visibility: hidden;"></div>
        <div ui-menu-bar x-menus="menubar" x-handler="this" class="view-menubar" ng-show="menubar"></div>
        <div ui-filter-box x-handler="this"></div>
        <div ui-view-customize class="pull-right"></div>
        <div ui-view-switcher class="pull-right"></div>
      </div>
    </div>
  </div>
  <div class="kanban-view row-fluid" ng-clsss="::schema.css">
    <div class="kanban-column" ng-repeat="column in ::columns" ui-kanban-column>
      <h3>{{::column.title}}</h3>
      <div class="input-group" ng-if="::column.canCreate" ng-show="hasPermission('create')">
        <input type="text" class="form-control" ng-model="$parent.newItem">
        <span class="input-group-btn">
          <button type="button" class="btn" ng-click="onCreate()"><span x-translate>Add</span></button>
        </span>
      </div>
      <ul class="kanban-card-list" ui-sortable="sortableOptions" ng-model="records">
        <li class="kanban-card" ng-class="hilite.color" ng-repeat="record in records" ui-card>
          <div class="kanban-card-menu btn-group pull-right" ng-if="hasButton('edit') || hasButton('delete')" ng-show="hasPermission('write') || hasPermission('remove')">
            <a tabindex="-1" href="javascript:" class="btn btn-link dropdown-toggle" data-toggle="dropdown">
              <i class="fa fa-caret-down"></i>
            </a>
            <ul class="dropdown-menu pull-right">
              <li><a href="javascript:" ng-if="hasButton('edit')" ng-show="hasPermission('write')" ng-click="onEdit(record)" x-translate>Edit</a></li>
              <li><a href="javascript:" ng-if="hasButton('delete')" ng-show="hasPermission('remove')" ng-click="onDelete(record)" x-translate>Delete</a></li>
            </ul>
          </div>
          <div class="kanban-card-body"></div>
        </li>
      </ul>
      <div class="kanban-empty">
        <span class="help-block text-center" x-translate>No records found.</span>
      </div>
      <div class="kanban-more ng-hide" ng-show="hasMore()">
        <a class="btn btn-load-more" tabindex="-1" href="" role="button" ng-click="onMore()">
          <span x-translate>load more</span>
          <i class="fa fa-arrow-right fa-fw"></i>
        </a>
      </div>
    </div>
  </div>
</div>
